import { useEffect } from 'react';
import { ArticleModelState, useDispatch, useSelector } from 'umi';
import { Carousel } from 'antd';
import styles from './index.less'

export default function Swiper() {
     // 通过useSelector获取model数据
     const article = useSelector((state: { article: ArticleModelState }) => state.article);
     const dispatch = useDispatch();
     useEffect(() => {
         dispatch({
             type: 'article/getArticleSwiper'
         })
     }, []);
    return <div className={styles.swire}>
        <div className={styles.swireContent}>
           <Carousel autoplay>
               {
                   article.articleSwiper.map((item,index)=>{
                       return <div key={index}>
                           <img src={item.cover} alt="" />
                       </div>
                   })
               }
           </Carousel>
        </div>
    </div>
}